<!--
 * @Author: your name
 * @Date: 2021-12-08 14:27:17
 * @LastEditTime: 2021-12-08 14:39:40
 * @LastEditors: Please set LastEditors
 * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 * @FilePath: \demo\src\views\Search\components\SearchPopupRent.vue
-->
<template>
  <div>
    <van-picker :columns="columns" value-key="label"> </van-picker>
    <div class="Search-Button">
      <van-button plain type="primary">取消</van-button>
      <van-button type="primary">确认</van-button>
    </div>
  </div>
</template>

<script>
import { getHousesConditionInfo } from '@/api/house.js'
import { mapState } from 'vuex'
import { Toast } from 'vant'
export default {
  name: 'SearchPopupRent',
  data () {
    return {
      columns: [
        // 第一列
        {
          values: []
        }
      ],
      prices: []
    }
  },
  computed: {
    ...mapState(['cityId'])
  },
  created () {
    this.getHousesConditionInfo()
    console.log(this.cityId)
  },

  methods: {
    async getHousesConditionInfo () {
      try {
        const res = await getHousesConditionInfo(this.cityId)
        console.log(res)
        this.prices = res.data.body.price
        this.columns = this.prices
      } catch (error) {
        Toast('请求失败！')
      }
    }
  }
}
</script>

<style scoped lang="less">
.Search-Button {
  display: flex;
  .van-button--normal {
    width: 60%;
  }
  .van-button--plain {
    width: 40%;
    border: 1px solid #d9d9da;
  }
}
</style>
